import { ref } from 'vue'

export function useIncreaseNumber(target: number, initialValue = 0, duration = 1000) {
  const currentValue = ref(initialValue)
  const startTime = performance.now()
  const animationFrameId = ref(0)
  const easeOutCubic = (x: number) => {
    return 1 - Math.pow(1 - x, 3)
  }
  const animate = (timestamp: number) => {
    const elapsed = timestamp - startTime
    const progress = Math.min(elapsed / duration, 1)
    const easedProgress = easeOutCubic(progress)
    currentValue.value = Math.floor(initialValue + (target - initialValue) * easedProgress)
    if (progress < 1) {
      animationFrameId.value = requestAnimationFrame(animate)
    } else {
      currentValue.value = target
    }
  }
  animationFrameId.value = requestAnimationFrame(animate)

  return {
    currentValue,
  }
}
